<%@ page pageEncoding="UTF-8"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="isperp" uri="/WEB-INF/tlds/isperp.tld"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<style type="text/css">
#processImageDiv div.flowNode {
	cursor: pointer;
}

#processRunTb  td {
	border: 1px solid #bababa !important; padding: 6px 2px;
}

#processRunTb  #processRunTr .td1 {
	font-weight: 700
}
</style>

<c:set var="sIndex" value="0"></c:set>
<div style="width:95%;margin:0 auto">
	<div class="code_comments code_module">
		<h2>
			<span class="right"> </span> <a name="comments">处理过程</a>
		</h2>
	</div>
	<div class="comments">
		<ul>
			<c:forEach items="${historys}" var="commentary" varStatus="status">

				<c:set var="sIndex" value="${sIndex+1 }"></c:set>
				<li class="row_${(sIndex)%2 }">
					<table>
						<tr>
							<td class="portrait"><c:choose>
									<c:when test="${empty commentary.photo }">
										<img src="img/elements/profile/avatar.png">
									</c:when>
									<c:otherwise>
										<img src="${commentary.photo}">
									</c:otherwise>
								</c:choose></td>
							<td class="body">
								<div class="r_title t_${commentary.task_def_key}">
									<b>${commentary.fullname}</b>
									<fmt:formatDate value="${commentary.action_time}"
										pattern="yyyy-MM-dd HH:mm:ss" />
									&nbsp;在“${commentary.name_}”执行“${commentary.action_name}”
									<div class="r_content TextContent">
										处理意见：${commentary.comment} <br>
									</div>
								</div>
						</tr>
					</table></li>



			</c:forEach>



			<c:if test="${'1' eq areRunning }">

				<li class="row_current">
					<table>
						<tr>
							<td class="portrait"><img
								src="img/elements/profile/avatar.png">
							</td>
							<td class="body">
								<div id="t_running"
									class="r_title t_${currentTaskTaskDefinitionKey }"
									style="color:red">

									&nbsp;进行中任务:“${currentTaskName}”(到达时间：
									<fmt:formatDate value="${currentTaskCreateTime}"
										pattern="yyyy-MM-dd HH:mm:ss" />
									)
									<div class="">
										&nbsp;候选人:<b>${currentUsers}</b>

									</div>
								</div>
						</tr>
					</table>
				</li>

			</c:if>

		</ul>

	</div>
	<div style="width:100%;margin:0 auto;">

		<div id="processImageHead" class="code_comments code_module">

			<h2>
				<span class="right"> <a href="javascript:void(0)" id="processImageRealSize" class="nui-txt-link"
					onclick="changeTraceImageSize(1)" style="background-color: #36c">实际大小</a> <a  class="nui-txt-link" href="javascript:void(0)" id="processImageWindowSize"
					onclick="changeTraceImageSize(0)">屏幕大小</a> </span> <a name="comments">流程图</a>
			</h2>
		</div>

		<div id="processImageDiv"
			style="position: relative;background:url('workflow/processRun/traceImage/${processId }')  no-repeat;width:${shapeMeta.width}px;height:${shapeMeta.height+50}px;">
			${shapeMeta.xml}</div>

		<div style="width:95%;margin:0 auto"></div>
		<isperp:buttonList buttonListId="traceBtns"></isperp:buttonList>
		<script type="text/javascript">
			$(function() {

				var $imgDiv = $("#processImageDiv");
				$imgDiv.draggable();
				 

			});

			function changeTraceImageSize(type) {
				var $imgDiv = $("#processImageDiv");
				 
				

				if (type == 0) {
					
					$("#processImageRealSize").css("background-color","#40AA63");
					$("#processImageWindowSize").css("background-color","#36c");
					
					var bl=${shapeMeta.height}/${shapeMeta.width};
					var $width = $("#processImageHead").width();
					
					var newHeight=($width * bl);

					$imgDiv.css("background-size", $width + "px " + newHeight + "px");
					$imgDiv.css("width", $width+"px");
					$imgDiv.css("height", newHeight+"px");
				} else {
					$("#processImageRealSize").css("background-color","#36c");
					$("#processImageWindowSize").css("background-color","#40AA63");
					
					$imgDiv.css("background-size",  "inherit");
					$imgDiv.css("width", "${shapeMeta.width}px");
					$imgDiv.css("height", "${shapeMeta.height}px");
				}
			}
		/**
			$("#processImageDiv .flowNode").tooltip({
				content : function() {
					var $e = $(this);
					var nodeId = $e.prop("id");
					return $(".t_" + nodeId).html();
				}
			});**/
		</script>

	</div>
</div>

<br>
<br>